<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>物流费用计算器 - OZON工具平台</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
        
        body {
            font-family: 'Roboto', sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f8f9fa;
            color: #333;
            display: flex;
        }
        .sidebar {
            width: 200px;
            background-color: white;
            color: #333;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            box-shadow: 2px 0 5px rgba(0,0,0,0.1);
            z-index: 100;
            overflow-y: auto;
            border-right: 1px solid #e0e0e0;
        }
        .sidebar-header {
            padding: 15px;
            background-color: #1565C0;
            text-align: left;
            font-weight: bold;
            font-size: 18px;
            border-bottom: 1px solid rgba(255,255,255,0.1);
            display: flex;
            align-items: center;
            color: white;
        }
        .sidebar-menu {
            padding: 15px 0;
        }
        .sidebar-menu-item {
            padding: 10px 15px;
            display: flex;
            align-items: center;
            color: #666;
            text-decoration: none;
            transition: background-color 0.3s;
            font-size: 14px;
        }
        .sidebar-menu-item:hover {
            background-color: rgba(0,0,0,0.05);
            color: #1565C0;
        }
        .sidebar-menu-item i {
            margin-right: 10px;
            width: 20px;
            text-align: center;
            color: #999;
        }
        .sidebar-menu-item:hover i {
            color: #1565C0;
        }
        .sidebar-breadcrumb {
            padding: 10px 15px;
            font-size: 14px;
            display: flex;
            align-items: center;
            background-color: #1976D2;
            margin-bottom: 5px;
        }
        .sidebar-breadcrumb a {
            color: rgba(255,255,255,0.8);
            text-decoration: none;
        }
        .sidebar-breadcrumb a:hover {
            color: white;
            text-decoration: underline;
        }
        .sidebar-breadcrumb .separator {
            margin: 0 8px;
            color: rgba(255,255,255,0.5);
        }
        .sidebar-breadcrumb .current {
            color: white;
            font-weight: 500;
        }
        .main-content {
            flex: 1;
            margin-left: 200px;
            padding: 20px;
        }
        .container {
            max-width: 900px;
            margin: 20px auto;
            padding: 30px;
            background-color: white;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
            border-radius: 12px;
            transition: all 0.3s ease;
            width: 100%;
        }
        .header {
            background: linear-gradient(135deg, #FF9800, #F57C00);
            color: white;
            padding: 25px;
            text-align: center;
            border-radius: 8px;
            margin-bottom: 30px;
            box-shadow: 0 5px 15px rgba(245, 124, 0, 0.3);
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .header h1 {
            margin: 0;
            font-size: 24px;
        }
        .logo {
            height: 40px;
            margin-right: 15px;
            vertical-align: middle;
        }
        .form-group {
            margin-bottom: 22px;
        }
        label {
            display: block;
            margin-bottom: 8px;
            font-weight: 500;
            color: #444;
            font-size: 15px;
        }
        input[type="text"], input[type="number"], select {
            width: 100%;
            padding: 12px 15px;
            border: 1px solid #e0e0e0;
            border-radius: 8px;
            box-sizing: border-box;
            font-size: 15px;
            transition: all 0.3s ease;
            box-shadow: 0 2px 5px rgba(0,0,0,0.05);
        }
        input[type="text"]:focus, input[type="number"]:focus, select:focus {
            border-color: #FF9800;
            box-shadow: 0 2px 10px rgba(255, 152, 0, 0.2);
            outline: none;
        }
        .btn {
            background: linear-gradient(135deg, #FF9800, #F57C00);
            color: white;
            border: none;
            padding: 12px 20px;
            border-radius: 8px;
            cursor: pointer;
            font-size: 16px;
            margin-right: 12px;
            font-weight: 500;
            transition: all 0.3s ease;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        }
        .btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 12px rgba(0,0,0,0.15);
        }
        .btn-secondary {
            background: linear-gradient(135deg, #f44336, #c62828);
        }
        .button-group {
            display: flex;
            margin-top: 20px;
            flex-wrap: wrap;
        }
        .footer {
            text-align: center;
            margin-top: 40px;
            padding-top: 20px;
            border-top: 1px solid #e0e0e0;
            color: #777;
            font-size: 14px;
        }
        .customer-service {
            position: fixed;
            bottom: 30px;
            right: 30px;
            width: 60px;
            height: 60px;
            background: linear-gradient(135deg, #FF9800, #F57C00);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            box-shadow: 0 4px 10px rgba(0,0,0,0.2);
            cursor: pointer;
            transition: all 0.3s ease;
            z-index: 1000;
        }
        .customer-service:hover {
            transform: scale(1.1);
            box-shadow: 0 6px 15px rgba(0,0,0,0.25);
        }
        .customer-service i {
            font-size: 28px;
        }
        
        /* Toast提示样式 */
        .toast {
            position: fixed;
            bottom: 80px;
            left: 50%;
            transform: translateX(-50%);
            background-color: rgba(0, 0, 0, 0.7);
            color: white;
            padding: 12px 24px;
            border-radius: 4px;
            font-size: 14px;
            z-index: 1100;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
        }
        .toast.show {
            opacity: 1;
        }
        
        /* 物流计算器特定样式 */
        .calculator-section {
            background-color: #f9f9f9;
            padding: 20px;
            border-radius: 8px;
            margin-bottom: 20px;
        }
        .calculator-section h3 {
            margin-top: 0;
            color: #555;
            border-bottom: 1px solid #ddd;
            padding-bottom: 10px;
            margin-bottom: 15px;
        }
        .dimension-inputs {
            display: flex;
            gap: 15px;
            margin-bottom: 15px;
        }
        .dimension-inputs .form-group {
            flex: 1;
        }
        .shipping-options {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-bottom: 20px;
        }
        .shipping-option {
            flex: 1;
            min-width: 120px;
            padding: 10px;
            border: 2px solid #ddd;
            border-radius: 8px;
            text-align: center;
            cursor: pointer;
            transition: all 0.3s ease;
        }
        .shipping-option:hover {
            border-color: #FF9800;
            background-color: rgba(255, 152, 0, 0.05);
        }
        .shipping-option.selected {
            border-color: #FF9800;
            background-color: rgba(255, 152, 0, 0.1);
        }
        .result-section {
            margin-top: 30px;
            display: none;
        }
        .result-table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }
        .result-table th, .result-table td {
            padding: 12px 15px;
            text-align: left;
            border-bottom: 1px solid #ddd;
        }
        .result-table th {
            background-color: #f2f2f2;
            font-weight: 500;
        }
        .result-table tr:hover {
            background-color: rgba(255, 152, 0, 0.05);
        }
        .shipping-info {
            margin-top: 20px;
            padding: 15px;
            background-color: #f2f2f2;
            border-radius: 8px;
            font-size: 14px;
        }
        .shipping-info p {
            margin: 5px 0;
        }
        .shipping-info ul {
            margin: 10px 0;
            padding-left: 20px;
        }
        .shipping-info li {
            margin-bottom: 5px;
        }
        .slider-container {
            margin-top: 10px;
            display: flex;
            align-items: center;
        }
        .slider {
            flex: 1;
            height: 5px;
            background: #ddd;
            outline: none;
            -webkit-appearance: none;
            appearance: none;
        }
        .slider::-webkit-slider-thumb {
            -webkit-appearance: none;
            appearance: none;
            width: 20px;
            height: 20px;
            background: #FF9800;
            border-radius: 50%;
            cursor: pointer;
        }
        .slider-value {
            margin-left: 15px;
            min-width: 60px;
            text-align: center;
            font-weight: 500;
        }
        .rate-table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
            font-size: 14px;
        }
        .rate-table th, .rate-table td {
            padding: 10px;
            text-align: center;
            border: 1px solid #ddd;
        }
        .rate-table th {
            background-color: #f2f2f2;
        }
        .rate-table tr:nth-child(even) {
            background-color: #f9f9f9;
        }
        .rate-table tr:hover {
            background-color: rgba(255, 152, 0, 0.05);
        }
        @media (max-width: 768px) {
            .dimension-inputs {
                flex-direction: column;
                gap: 10px;
            }
            .shipping-options {
                flex-direction: column;
            }
            .button-group {
                flex-direction: column;
            }
            .btn {
                margin-bottom: 10px;
                margin-right: 0;
            }
        }
    </style>
</head>
<body>
    <div class="sidebar">
        <div class="sidebar-header">
            <span>OZON工具平台</span>
            <i class="fas fa-bars" style="margin-left: auto;"></i>
        </div>
        <div class="sidebar-menu">
            <a href="index.html" class="sidebar-menu-item"><i class="fas fa-th-large"></i> Dashboard</a>
            <div class="sidebar-breadcrumb">
                <a href="index.html">首页</a>
                <span class="separator">></span>
                <a href="tools.html">实用工具</a>
                <span class="separator">></span>
                <span class="current">物流费用计算器</span>
            </div>
            <a href="index.html" class="sidebar-menu-item"><i class="fas fa-home"></i> 首页</a>
            <a href="tools.html" class="sidebar-menu-item"><i class="fas fa-tools"></i> 实用工具</a>
            <a href="ai-tools.html" class="sidebar-menu-item"><i class="fas fa-robot"></i> AI工具</a>
            <a href="data-analysis.html" class="sidebar-menu-item"><i class="fas fa-chart-line"></i> 数据分析</a>
            <a href="settings.html" class="sidebar-menu-item"><i class="fas fa-cog"></i> 设置</a>
        </div>
    </div>
    
    <div class="main-content">
        <div class="container">
            <div class="header">
                <img src="logo.png" alt="物流费用计算器" class="logo">
                <h1>物流费用计算器</h1>
            </div>
            
            <div class="calculator-section">
                <h3>基本信息</h3>
                <p>1. 所有的物流费用都是计算到自提点（非到门）的费用。</p>
                <p>2. 尺寸非必填，设填尺寸就不检查尺寸是否超标，包裹是否计抛。</p>
                <p>3. 商品类目非必选，如果没选商品类目，佣金率按照1500户布以下12%，1500户布以上20%来计算。</p>
                <p>4. 表格中的利润 = 售价 - 佣金 - 运费 - 贴单费 -其他费用（售价*其他费用占比）</p>
                <p>5. 汇率需要根据汇率网站的最新汇率手动更新。<a href="#" id="check-rate">查看实时汇率</a>。</p>
                <p>6. 如果你合作的物流商发给你新的运费表，请第一时间也通过微信转发我一份，我们会更新到百宝箱。</p>
                <p>7. 如果你需要添加其他物流商，请反馈给我。</p>
            </div>
            
            <div class="calculator-section">
                <h3>包裹信息</h3>
                
                <div class="form-group">
                    <label>尺寸（非必填）</label>
                    <div class="dimension-inputs">
                        <div class="form-group">
                            <input type="number" id="length" placeholder="包裹的长度（CM）">
                        </div>
                        <div class="form-group">
                            <input type="number" id="width" placeholder="包裹的宽度（CM）">
                        </div>
                        <div class="form-group">
                            <input type="number" id="height" placeholder="包裹的高度（CM）">
                        </div>
                    </div>
                </div>
                
                <div class="form-group">
                    <label>物流商</label>
                    <div class="shipping-options">
                        <div class="shipping-option" data-value="GUOO">
                            <span>GUOO</span>
                        </div>
                        <div class="shipping-option" data-value="CEL">
                            <span>CEL</span>
                        </div>
                        <div class="shipping-option selected" data-value="UNI">
                            <span>UNI</span>
                        </div>
                        <div class="shipping-option" data-value="RETS">
                            <span>RETS</span>
                        </div>
                        <div class="shipping-option" data-value="URAL">
                            <span>URAL</span>
                        </div>
                        <div class="shipping-option" data-value="兴远">
                            <span>兴远</span>
                        </div>
                        <div class="shipping-option" data-value="阿尔巴特">
                            <span>阿尔巴特</span>
                        </div>
                        <div class="shipping-option" data-value="ZTO">
                            <span>ZTO</span>
                        </div>
                    </div>
                </div>
                
                <div class="form-group">
                    <label>商品类目</label>
                    <select id="product-category">
                        <option value="">请选择商品类目</option>
                        <option value="category1">类目1</option>
                        <option value="category2">类目2</option>
                        <option value="category3">类目3</option>
                    </select>
                </div>
                
                <div class="form-group">
                    <label>佣金率</label>
                    <div class="slider-container">
                        <input type="range" min="12" max="20" value="12" class="slider" id="commission-rate">
                        <span class="slider-value" id="commission-rate-value">12.00%</span>
                    </div>
                </div>
                
                <div class="form-group">
                    <label>* 贴单费</label>
                    <input type="number" id="label-fee" placeholder="贴单费" value="2">
                </div>
                
                <div class="form-group">
                    <label>汇率</label>
                    <input type="number" id="exchange-rate" placeholder="汇率" value="11">
                </div>
                
                <div class="form-group">
                    <label>* 重量</label>
                    <input type="number" id="weight" placeholder="请输入包裹的重量（千克）" required>
                </div>
                
                <div class="form-group">
                    <label>* 采购成本</label>
                    <input type="number" id="purchase-cost" placeholder="请填写商品的采购成本(人民币￥)" required>
                </div>
                
                <div class="form-group">
                    <label>* 人民币售价</label>
                    <input type="number" id="selling-price" placeholder="请填写商品的售价(￥)" required>
                </div>
                
                <div class="form-group">
                    <label>其他费用占比%</label>
                    <input type="number" id="other-fee-percentage" placeholder="其他费用的占售价的比率，建议不低于5，不填默认0" value="5">
                    <p style="font-size: 12px; color: #666; margin-top: 5px;">(尾程、收单、提现、货损等%)</p>
                </div>
                
                <div class="form-group">
                    <label>商品户布售价</label>
                    <input type="text" id="product-price" placeholder="系统自动计算户布价格" readonly>
                </div>
                
                <div class="button-group">
                    <button class="btn" id="calculate-btn">计算利润</button>
                    <button class="btn btn-secondary" id="clear-btn">清空</button>
                </div>
            </div>
            
            <div class="result-section" id="result-section">
                <h3>以下表格的的"运费"，"利润"，"利润率"都是以 单个订单 为单位（而非单个商品）进行计算。</h3>
                
                <div id="shipping-rates-table">
                    <!-- 运费计算结果表格将在这里动态生成 -->
                </div>
            </div>
            
            <div class="footer">
                © 2025 Made By Nicole. 
            </div>
        </div>
    </div>
    
    <div class="customer-service" onclick="showCustomerService()">
        <i class="fas fa-headset"></i>
    </div>
    
    <div id="toast" class="toast"></div>

    <script>
        // UNI物流费率数据
        const uniRates = {
            extraSmall: {
                weight: "0~0.5千克(含)",
                price: "0~1500(含)",
                express: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                standard: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                economy: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                }
            },
            budget: {
                weight: "0.5(不含)~30千克(含)",
                price: "0~1500(含)",
                express: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                standard: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                economy: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                }
            },
            small: {
                weight: "0~2千克(含)",
                price: "1500(不含)~7000(含)",
                express: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                standard: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                economy: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                }
            },
            big: {
                weight: "2(不含)~30千克(含)",
                price: "1500(不含)~7000(含)",
                express: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                standard: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                economy: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                }
            },
            premiumSmall: {
                weight: "0~5千克(含)",
                price: "7000(不含)~25万(含)",
                express: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                standard: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                economy: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                }
            },
            premiumBig: {
                weight: "5(不含)~30千克(含)",
                price: "7000(不含)~25万(含)",
                express: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                standard: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                },
                economy: {
                    shipping: 0,
                    profit: 0,
                    profitRate: 0
                }
            }
        };

        // UNI物流费率计算函数
        function calculateUniShipping(weight, price) {
            // 根据重量和价格确定类别
            let category;
            let baseShipping = 0;
            let weightFee = 0;
            
            // Extra Small: 0~0.5kg, 0~1500卢布
            if (weight <= 0.5 && price <= 1500) {
                category = 'extraSmall';
                // Express
                baseShipping = 3;
                weightFee = 0.045 * weight;
                uniRates.extraSmall.express.shipping = baseShipping + weightFee;
                
                // Standard
                baseShipping = 3;
                weightFee = 0.035 * weight;
                uniRates.extraSmall.standard.shipping = baseShipping + weightFee;
                
                // Economy
                baseShipping = 3;
                weightFee = 0.025 * weight;
                uniRates.extraSmall.economy.shipping = baseShipping + weightFee;
            }
            // Budget: 0.5~30kg, 0~1500卢布
            else if (weight > 0.5 && weight <= 30 && price <= 1500) {
                category = 'budget';
                // Express
                baseShipping = 23;
                weightFee = 0.033 * weight;
                uniRates.budget.express.shipping = baseShipping + weightFee;
                
                // Standard
                baseShipping = 23;
                weightFee = 0.025 * weight;
                uniRates.budget.standard.shipping = baseShipping + weightFee;
                
                // Economy
                baseShipping = 23;
                weightFee = 0.017 * weight;
                uniRates.budget.economy.shipping = baseShipping + weightFee;
            }
            // Small: 0~2kg, 1500~7000卢布
            else if (weight <= 2 && price > 1500 && price <= 7000) {
                category = 'small';
                // Express
                baseShipping = 16;
                weightFee = 0.045 * weight;
                uniRates.small.express.shipping = baseShipping + weightFee;
                
                // Standard
                baseShipping = 16;
                weightFee = 0.035 * weight;
                uniRates.small.standard.shipping = baseShipping + weightFee;
                
                // Economy
                baseShipping = 16;
                weightFee = 0.025 * weight;
                uniRates.small.economy.shipping = baseShipping + weightFee;
            }
            // Big: 2~30kg, 1500~7000卢布
            else if (weight > 2 && weight <= 30 && price > 1500 && price <= 7000) {
                category = 'big';
                // 这里添加Big类别的运费计算
                // 由于图片中没有显示具体数值，这里使用示例值
                uniRates.big.express.shipping = 20 + 0.04 * weight;
                uniRates.big.standard.shipping = 20 + 0.03 * weight;
                uniRates.big.economy.shipping = 20 + 0.02 * weight;
            }
            // Premium Small: 0~5kg, 7000~25万卢布
            else if (weight <= 5 && price > 7000 && price <= 250000) {
                category = 'premiumSmall';
                // 这里添加Premium Small类别的运费计算
                // 由于图片中没有显示具体数值，这里使用示例值
                uniRates.premiumSmall.express.shipping = 25 + 0.05 * weight;
                uniRates.premiumSmall.standard.shipping = 25 + 0.04 * weight;
                uniRates.premiumSmall.economy.shipping = 25 + 0.03 * weight;
            }
            // Premium Big: 5~30kg, 7000~25万卢布
            else if (weight > 5 && weight <= 30 && price > 7000 && price <= 250000) {
                category = 'premiumBig';
                // 这里添加Premium Big类别的运费计算
                // 由于图片中没有显示具体数值，这里使用示例值
                uniRates.premiumBig.express.shipping = 30 + 0.06 * weight;
                uniRates.premiumBig.standard.shipping = 30 + 0.05 * weight;
                uniRates.premiumBig.economy.shipping = 30 + 0.04 * weight;
            }
            else {
                // 如果不在任何范围内，返回默认值或错误信息
                return null;
            }
            
            return category;
        }

        // 计算利润和利润率
        function calculateProfit(sellingPrice, commissionRate, shippingFee, labelFee, otherFeePercentage) {
            const commission = sellingPrice * (commissionRate / 100);
            const otherFee = sellingPrice * (otherFeePercentage / 100);
            const profit = sellingPrice - commission - shippingFee - labelFee - otherFee;
            const profitRate = (profit / sellingPrice) * 100;
            
            return {
                profit: profit.toFixed(2),
                profitRate: profitRate.toFixed(2) + '%'
            };
        }

        // 初始化页面
        document.addEventListener('DOMContentLoaded', function() {
            // 物流商选择
            const shippingOptions = document.querySelectorAll('.shipping-option');
            shippingOptions.forEach(option => {
                option.addEventListener('click', function() {
                    shippingOptions.forEach(opt => opt.classList.remove('selected'));
                    this.classList.add('selected');
                });
            });
            
            // 佣金率滑块
            const commissionSlider = document.getElementById('commission-rate');
            const commissionValue = document.getElementById('commission-rate-value');
            
            commissionSlider.addEventListener('input', function() {
                commissionValue.textContent = this.value + '.00%';
            });
            
            // 计算按钮
            const calculateBtn = document.getElementById('calculate-btn');
            calculateBtn.addEventListener('click', function() {
                const weight = parseFloat(document.getElementById('weight').value);
                const sellingPrice = parseFloat(document.getElementById('selling-price').value);
                const exchangeRate = parseFloat(document.getElementById('exchange-rate').value) || 11;
                const commissionRate = parseFloat(document.getElementById('commission-rate').value);
                const labelFee = parseFloat(document.getElementById('label-fee').value) || 2;
                const otherFeePercentage = parseFloat(document.getElementById('other-fee-percentage').value) || 5;
                
                if (!weight || !sellingPrice) {
                    showToast('请填写必填项：重量和售价');
                    return;
                }
                
                // 计算户布价格
                const rublePrice = sellingPrice * exchangeRate;
                document.getElementById('product-price').value = rublePrice.toFixed(2) + ' ₽';
                
                // 计算运费和利润
                const selectedShipper = document.querySelector('.shipping-option.selected').dataset.value;
                
                if (selectedShipper === 'UNI') {
                    const category = calculateUniShipping(weight, rublePrice);
                    
                    if (category) {
                        // 计算各种运输方式的利润和利润率
                        for (const type of ['express', 'standard', 'economy']) {
                            const shippingFee = uniRates[category][type].shipping;
                            const profitInfo = calculateProfit(
                                sellingPrice, 
                                commissionRate, 
                                shippingFee / exchangeRate, // 将卢布转换为人民币
                                labelFee, 
                                otherFeePercentage
                            );
                            
                            uniRates[category][type].profit = profitInfo.profit;
                            uniRates[category][type].profitRate = profitInfo.profitRate;
                        }
                        
                        // 显示结果表格
                        displayUniResults(category, exchangeRate);
                    } else {
                        showToast('您的商品重量或价格超出了计算范围');
                    }
                } else {
                    showToast('目前只支持UNI物流商的计算');
                }
                
                // 显示结果区域
                document.getElementById('result-section').style.display = 'block';
            });
            
            // 清空按钮
            const clearBtn = document.getElementById('clear-btn');
            clearBtn.addEventListener('click', function() {
                document.getElementById('length').value = '';
                document.getElementById('width').value = '';
                document.getElementById('height').value = '';
                document.getElementById('weight').value = '';
                document.getElementById('purchase-cost').value = '';
                document.getElementById('selling-price').value = '';
                document.getElementById('product-price').value = '';
                document.getElementById('commission-rate').value = 12;
                document.getElementById('commission-rate-value').textContent = '12.00%';
                document.getElementById('label-fee').value = 2;
                document.getElementById('exchange-rate').value = 11;
                document.getElementById('other-fee-percentage').value = 5;
                document.getElementById('result-section').style.display = 'none';
            });
            
            // 查看汇率链接
            document.getElementById('check-rate').addEventListener('click', function(e) {
                e.preventDefault();
                window.open('https://www.xe.com/currencyconverter/convert/?Amount=1&From=RUB&To=CNY', '_blank');
            });
        });

        // 显示UNI结果表格
        function displayUniResults(category, exchangeRate) {
            const tableContainer = document.getElementById('shipping-rates-table');
            
            let html = `
                <h3>UNI 运费计算</h3>
                <table class="rate-table">
                    <thead>
                        <tr>
                            <th>物流方式</th>
                            <th>重量</th>
                            <th>金额(户布)</th>
                            <th>运费</th>
                            <th>利润</th>
                            <th>利润率</th>
                        </tr>
                    </thead>
                    <tbody>
            `;
            
            const types = {
                'express': 'Express空运',
                'standard': 'Standard陆空',
                'economy': 'Economy经济'
            };
            
            for (const [type, typeName] of Object.entries(types)) {
                html += `
                    <tr>
                        <td>${typeName}</td>
                        <td>${uniRates[category].weight}</td>
                        <td>${uniRates[category].price}</td>
                        <td>${uniRates[category][type].shipping.toFixed(2)} ₽ (¥${(uniRates[category][type].shipping / exchangeRate).toFixed(2)})</td>
                        <td>¥${uniRates[category][type].profit}</td>
                        <td>${uniRates[category][type].profitRate}</td>
                    </tr>
                `;
            }
            
            html += `
                    </tbody>
                </table>
            `;
            
            tableContainer.innerHTML = html;
        }

        function showToast(message, duration = 2000) {
            const toast = document.getElementById('toast');
            toast.textContent = message;
            toast.classList.add('show');
            
            setTimeout(() => {
                toast.classList.remove('show');
            }, duration);
        }
        
        function showCustomerService() {
            showToast('联系我们：邮箱：zouqifeng@jiawae-commerce.com\n工作时间：周一至周五 9:00-18:00');
        }
    </script>
</body>
</html>